<template>
	<view class="content">
		<u--input v-model="phone" border="bottom" placeholder="请输入手机号"></u--input><br>
		<u--input v-model="password" border="bottom" placeholder="请输入密码"></u--input></br>
		<view  class="content-son">
			<u-button shape="circle" @click="login()" style="width: 35%;" color="#ff6600" :hairline="false"
				:throttleTime="2000">登录</u-button>
			<text class="content-text" @click="goforgotPassword()">
				忘记密码?
			</text>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				phone: '',
				password: ''
			}
		},
		methods: {
			goforgotPassword() {
				uni.navigateTo({
					url: '/pages/content/forgotPassword/goforgotPassword'
				});
			},
			login() {
				if (this.validateInput()) {
					// 进行登录操作
					console.log('手机号:', this.phone, '密码:', this.password);
					// 这里调用登录接口
				}
			},
			validateInput() {
				// 校验手机号
				if (!this.validatePhone(this.phone)) {
					uni.showToast({
						title: '手机号格式不正确',
						icon: 'none'
					});
					return false;
				}
				// 校验密码
				if (!this.validatePassword(this.password)) {
					uni.showToast({
						title: '密码长度至少为8位',
						icon: 'none'
					});
					return false;
				}
				return true;
			},
			validatePhone(phone) {
				// 简单的手机号校验规则，实际应用中可能需要更复杂的规则
				return /^1[3-9]\d{9}$/.test(phone);
			},
			validatePassword(password) {
				// 密码长度至少为6位
				if (this.password.length < 8) {
					uni.showToast({
						title: '密码长度至少为8位',
						icon: 'none'
					});
					return false;
				}
				// 校验密码复杂度
				if (!this.isPasswordComplex(this.password)) {
					uni.showToast({
						title: '密码需要包含大写字母、小写字母、数字和特殊字符',
						icon: 'none'
					});
					return false;
				}
			}
		}
	}
</script>


<style>
	.content {
		width: 90%;
		margin: auto;
	}
	.content .u-input{
		width: 80%;
	}
	.content-son {
		width: 80%;
		display: flex;
		justify-content: space-between;
		align-items: center;
	
	}
	.content-text {
		text-align: right;
		/* 文本靠右显示 */
		flex-grow: 1;
		color: #ccc;
	}
</style>